import React, { Component } from 'react'
import { IntlProvider } from 'react-intl'
import { Locales, fallback } from './locales'
import MainFrame from '../Components/main'

export default class AppRoot extends Component {

    state = {
        locale: navigator.language
    }

    handleMsg = () => {
        const tr = Locales[this.state.locale]

        if (tr === undefined) {
            return fallback
        } else {
            return tr.name
        }

    }

    changeLocale = (locale) => {
        this.setState({ locale })
    }

    render() {
        return (
            <IntlProvider
                messages={this.handleMsg()}
                locale={navigator.language}
            >
                <MainFrame
                    changeLocale={this.changeLocale}
                />
            </IntlProvider>
        )
    }
}
